//商品列表详情 js

   // 1, 通过 tools.js 中封装的 函数 获取 浏览器地址栏传参数据
    //  获取 goods_id 的值
    const val = myGetUrlValObj()
    console.log(val);
    // 2发送请求获取
    const xhr = myPromiseJQueryAjax( "http://localhost/server/goods_detail.php", 'post', { goods_id: val.goods_id }, 'json');
    xhr.then(function (res) {
      console.log(res);
      // 根据结果 动态渲染生成页面
      let str = `
    <div class="panel panel-default">
      <div class="panel-heading">
        <h3 class="panel-title">商品详细信息</h3>
      </div>
      <div class="panel-body">
        <div class="media">
          <div class="media-left">
            <a href="#">
              <img class="media-object" src="${res.goods_big_logo}" alt="...">
            </a>
          </div>
          <div class="media-body">
            <h4 class="media-heading">${res.goods_name}</h4>
            <p>
              <i class="glyphicon glyphicon-yen"></i>
              <span>${res.goods_price}</span>
            </p>
            <p style="position:relative">
              <input value="1" class="num">
              <button name="减" type="button" class="jian btn btn-default">-</button>
              <button name="加" type="button" class="jia btn btn-default">+</button>
            </p>
            <p>
              <a href="javascript:;" name="cart" class="btn btn-warning btn-lg" role="button">立即购买</a>
              <a href="javascript:;" name="cart" class="btn btn-danger btn-lg" role="button">加入购物车</a>
            </p>
          </div>
        </div>
        <ul class="nav nav-tabs">
          <li role="presentation" class="active"><a href="#">商品详细信息</a></li>
          <li role="presentation"><a href="#">商品参数信息</a></li>
          <li role="presentation"><a href="#">相关商品</a></li>
        </ul>
        <div>
          ${res.goods_introduce}
        </div>
      </div>
    </div>
    
    `;
      $('.container').html(str);
      // 3, 给 + - 按钮 添加点击事件
      // 页面内容是 动态生成的 给 父级标签 添加 点击事件 
      // 通过 事件委托 来完成效果
      $('.container').click(function (e) {
        if (e.target.getAttribute('name') === '减') {
          // (1) 获取 input中的数据 -1 之后 再 赋值回来
          // 如果 小于 1 就 赋值 1 如果 大于1 就 赋值 这个数值本身
          $('.num').val($('.num').val() - 1 < 1 ? 1 : $('.num').val() - 1);
        } else if (e.target.getAttribute('name') === '加') {
          // (2) 获取 input中的数据 +1 之后 再 赋值回来
          // 如果 大于 库存数值 就赋值 库存数值本身 如果 不大于 库存数值 赋值 数值本身
          $('.num').val($('.num').val() - 0 + 1 > res.goods_number ? res.goods_number : $('.num').val() - 0 + 1);
          // 4 点击购物车
        } else if (e.target.getAttribute('name') === 'cart') {
          // (1)判断用户登录没登录
          //获取cookie值
          const cookieObj = myGetCookie();
          // console.log(cookieObj);
          // (2) 没有登录的情况  cookie是字符串1
          if (cookieObj.login !== '1') {
            //判断结果 如不是1 证明没有登录
            if (window.confirm('你还没有登录请登录')) {
              window.location.href = `./the_login.html?url=${window.location.href}`;
            }
            // 终止操作
            return;
          }
          // 5 已经登录的情况
          //(1) 获取购物车 数据信息
          // 注意没有购物车 信息获取是undefined、
          let cart = localStorage.cart;
          // console.log(res);
          if (cart === undefined) {
            // (2) 没创建购物车信息 直接添加当前商品信息
            // 判断购买的数量符合范围
            if (!($('.num').val() - 0 >= 1 && $('.num').val() - 0 <= res.goods_number)) {
              window.alert('你输入的数值不符合范围');
              return;
            }
            // 6  购买数量
            res.num = $('.num').val() - 0;

            // 购买状态 新增商品 购买状态 默认是 购买
            res.buy = true;

            // localStorage 字符串 和 json字符串
            // 将 商品 信息转化为 json字符串 存储
            // 存储的数据结构 必须是 数组中存储对象 不能直接存储对象

            // localStorage.setItem( 'cart' , JSON.stringify( [res] )  );

            localStorage.cart = JSON.stringify([res]);
            // 7 购物车 数据信息 已经存在
          } else {
            // (1)先将json字符串 还原为对应的数据类型
            cart = JSON.parse(cart);
            // (2)当前购物车是空数组
            if (cart.length === 0) {
              // 直接添加商品信息
              if (!($('.num').val() - 0 >= 1 && $('.num').val() - 0 <= res.goods_number)) {
                window.alert('购买数量有误');
                return;
              }
              res.num = $('.num').val() - 0;
              res.buy = true;

              localStorage.cart = JSON.stringify([res]);
              // 8 当前购物车不是空车
            } else {
              // (1)如果购物车商品没有直接添加
              // (2)如果购物车有这个商品 添加购买数量
              // (3) 当商品在购物车中结果是true  不在购物车是false
              let bool = cart.some(function (val) {
                // (4)购物车商品id和当前商品id相等
                return val.goods_id === res.goods_id;
              })
              if (bool) {
                // 9给对应的商品添加 购买的数量 
                // (1)循环遍历 找到goods_id相同的商品
                for (let i = 0; i <= cart.length - 1; i++) {
                  if (cart[i].goods_id === res.goods_id) {
                    // 如果 购物车商品id 和 当前商品id 相同
                    // 添加 购买商品个数
                    let numAdd = (cart[i].num - 0) + ($('.num').val() - 0);
                    // 判断 添加 新的数量之后 购买 数量 在 正确的范围之间
                    if (!(numAdd >= 1 && numAdd <= cart[i].goods_number)) {
                      window.alert('您输入的商品范围有误');
                      return;
                    }
                    // 修改购物车 数据中 购买商品的商品数量
                    cart[i].num = numAdd;
                    // 将 新的 购物车数据数组 再 设定给 localStorage中购物车数据
                    localStorage.cart = JSON.stringify(cart);

                  }
                }
                // 当前购物车中没有当前要添加的这个商品

              } else {
                //补充当前商品的购买数量和购买状态
                // 将 新的对象 写入到 数组的起始位置
                // 将 新的数组 设定给 localStorage 中 购物车数据
                if (!($('.num').val() - 0 >= 1 && $('.num').val() - 0 <= res.goods_number)) {
                  window.alert('您输入的商品数据有误');
                  return;
                }

                res.num = $('.num').val() - 0;
                res.buy = true;
                cart.unshift(res);
                localStorage.cart = JSON.stringify(cart);
              }
            }
          }
          // 添加 完 购物车 信息后 跳转 购物车页面
          window.location.href = './cart.html';

        }

      })
    })